<template>
	<view class="userHome">
		<z-paging ref="paging" v-model="dataList" @query="queryList">
			<template #top>
				<tui-navigation-bar :isFixed="false" :titleSize="18" :titleLineHeight="18" :titlefontWeight="800" :isOpacity="false"
					:splitLine="true" @init="initNavigation" title="我的动态" backgroundColor="#fff" color="#000">
					<view class="tui-header-icon" :style="{ marginTop: top + 'px' }">
						<tui-icon name="arrowleft" color="#333" @click="back"></tui-icon>
					</view>
				</tui-navigation-bar>
				<view class="tabList">
					<tutor-tab :list="['笔记列表','收藏列表']" @clickSwtichTab="clickSwtichTab" :atciveIndex="atciveIndex"></tutor-tab>
				</view>
			</template>
			<view class="userHome-content">
				<!-- 笔记列表瀑布流 -->
				<view class="noteList" v-if="!atciveIndex">
					<tui-waterfall :listData="dataList">
						<template v-slot:left="{ list }">
							<DynamicItem isMyNote :ossUrl="ossUrl" :isDel="false" v-for="(item,index) in list" :key="index" :item="item" @clickDetail="toDynamicDetail" @delDynamic="delDynamic"></DynamicItem>
						</template>
						<template v-slot:right="{ list }">
							<DynamicItem isMyNote :ossUrl="ossUrl" :isDel="false" v-for="(item,index) in list" :key="index" :item="item" @clickDetail="toDynamicDetail" @delDynamic="delDynamic"></DynamicItem>
						</template>
					</tui-waterfall>
				</view>
				<!--收藏列表瀑布流-->
				<view class="collectList" v-else>
					<tui-waterfall :listData="dataList">
						<template v-slot:left="{ list }">
							<DynamicItem :ossUrl="ossUrl" isDate :isComment="false" v-for="(item,index) in list" :key="index" :item="item" @clickDetail="toDynamicDetail"></DynamicItem>
						</template>
						<template v-slot:right="{ list }">
							<DynamicItem :ossUrl="ossUrl" isDate :isComment="false" v-for="(item,index) in list" :key="index" :item="item" @clickDetail="toDynamicDetail"></DynamicItem>
						</template>
					</tui-waterfall>
				</view>
			</view>
		</z-paging>
		<!-- <view class="footer">
			<tui-form-button @click="pushDynamic" radius="70rpx" size="34" color="#fff" width="690rpx" height="84rpx"
				background="#2FD7D3">
				发布新闻
			</tui-form-button>
		</view> -->
	</view>
</template>

<script>
	import DynamicItem from '../../../find/compontents/dynamicItem.vue'
	import { myCollectList,collectDynamic,myLoginDynamicList,delDynamic} from "@/http/api/dynamic/dynamic.js" 
	import Cache from "@/utils/cache";
	export default {
		components: {
			DynamicItem
		},
		data() {
			return {
				ossUrl: getApp().globalData.ossurl,// 图片前缀
				// 导航栏
				top: 0, // 导航栏距顶部的距离
				height: 0, // 导航栏高度
				scrollTop: 0.5,

				// tab切换
				atciveIndex: 0, //切换笔记和收藏列表

				// 列表数据
				dataList: [],

				// 邀约弹窗
				isAgreement: false,
				visible: false, //邀约填写项
			};
		},
		onLoad() {
			uni.$on('myDynamicRefresh',(e)=>{
				 if(e){
					 this.$refs.paging.reload()
				 }
			}) 
		},
		methods: {
			// 导航栏
			initNavigation(e) {
				this.top = e.top;
				this.height = e.height
			},
			back() {
				uni.navigateBack();
			},
			// tab切换
			clickSwtichTab(data) {
				this.atciveIndex = data.index
				this.$refs.paging.reload()
			},
			// 发布动态
			pushDynamic(){
				uni.navigateTo({
					url:'/pages/find/modules/pushDynamic/pushDynamic'
				})
			},
			// 动态详情
			toDynamicDetail(e) {
				let dynamicId = e.dynamicId
				uni.navigateTo({
					url: '/pages/find/modules/recommendDetails/recommendDetails?dynamicId='+dynamicId
				})
			},
			// 删除动态
			delDynamic(e){
				let that = this;
				uni.showModal({
					title: '提示',
					content: '确认删除该动态吗？',
					showCancel: true,
					cancelColor: "#555",
					confirmColor: "#eb0909",
					confirmText: "确定",
					success(res) {
						if (res.confirm) {
							let dynamicId = e.dynamicId
							delDynamic(dynamicId).then(res => {
								if (res.code == 200) {
									 that.$utils.toast("删除成功");
									 that.$refs.paging.reload()
								} else {
									that.$utils.toast(res.msg);
								}
							}).catch(res => {
								that.$utils.toast(res);
							}) 
						}
					}
				})
			},
			//加载笔记列表
			queryList(pageNo, pageSize) {
				if(!this.atciveIndex){
					myLoginDynamicList({
						pageNum:pageNo,
						pageSize,
					}).then(res => {
						if (res.code == 200) {
							 this.$refs.paging.complete(res.rows); 
						} else {
							this.$utils.toast(res.msg);
						}
					}).catch(res => {
						this.$refs.paging.complete(false);
					})
				}else{
					myCollectList({
						pageNum:pageNo,
						pageSize
					}).then(res => {
						if (res.code == 200) {
							 this.$refs.paging.complete(res.rows); 
						} else {
							 this.$utils.toast(res.msg);
						}
					}).catch(res => {
						this.$refs.paging.complete(false);
					})
				}
			},
		}
	};
</script>
<style lang="scss" scoped>
	// @import "../../../find/modules/recommendDetails/recommendDetails.scss";
	@import "./mineDynamic.scss";
</style>